<template>
    <div>
        <el-form :model="dataForm"
                 :rules="dataRule"
                 ref="dataForm" @keyup.enter.native="dataFormSubmit()"
                 label-width="130px"
                 :inline="true"
        >
            <el-form-item label="职位名称" prop="jobName">
                <el-col :span="24">
                    <el-input v-model="dataForm.jobName" placeholder="职位名称"></el-input>
                </el-col>
            </el-form-item>

            <el-form-item label="职位部门" prop="jobDeptement">
                <el-input v-model="dataForm.jobDeptement" placeholder="职位部门"></el-input>
            </el-form-item>
            <el-form-item label="联系人" prop="jobContact">
                <el-input v-model="dataForm.jobContact" placeholder="联系人"></el-input>
            </el-form-item>
            <el-form-item label="联系手机" prop="jobPhone">
                <el-input v-model="dataForm.jobPhone" placeholder="联系手机"></el-input>
            </el-form-item>
            <el-form-item label="联系固话" prop="jobFixPhone">
                <el-input v-model="dataForm.jobFixPhone" placeholder="联系固话"></el-input>
            </el-form-item>
            <el-form-item label="联系微信" prop="jobWechat">
                <el-input v-model="dataForm.jobWechat" placeholder="联系微信"></el-input>
            </el-form-item>
            <el-form-item label="联系邮箱" prop="jobEmail">
                <el-input v-model="dataForm.jobEmail" placeholder="联系邮箱"></el-input>
            </el-form-item>
            <el-form-item label="联系qq" prop="jobQq">
                <el-input v-model="dataForm.jobQq" placeholder="联系qq"></el-input>
            </el-form-item>


            <el-form-item label="紧急招聘" prop="isUrgency">
                <el-col :span="22">
                    <el-select v-model="dataForm.isUrgency" placeholder="是否急聘">
                        <el-option label="急聘" value="1"></el-option>
                        <el-option label="非急聘" value="0"></el-option>
                    </el-select>
                </el-col>
            </el-form-item>

            <el-form-item label="所属行业" prop="industryOptions" label-width="130px">
                <el-col :span="22">
                    <el-cascader
                            clearable
                            v-model="industryOptionsArr"
                            :options="industryOptions"
                            @change="handleChangeIndustory">
                    </el-cascader>
                </el-col>
            </el-form-item>

            <el-form-item label="工作地址" property="companyAddressOptions" label-width="115px">
                <el-col :span="22">
                    <el-cascader
                            v-model="companyAddressOptionsArr"
                            :options="companyAddressOptions"
                            @change="handleChangeAddress">
                    </el-cascader>
                </el-col>
            </el-form-item>

            <el-form-item label="详细地址" prop="jobDetailAddress" label-width="115px">
                <el-col :span="24">
                    <el-input v-model="dataForm.jobDetailAddress" placeholder="详细地址"></el-input>
                </el-col>
            </el-form-item>

            <el-form-item label="薪资范围" required>
                <el-col :span="11">
                    <el-form-item prop="jobSalaryStart">
                        <el-input v-model="dataForm.jobSalaryStart" style="width: 100%;" placeholder="薪资范围"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="1">-</el-col>
                <el-col :span="11">
                    <el-form-item prop="jobSalaryEnd">
                        <el-input v-model="dataForm.jobSalaryEnd" style="width: 100%;" placeholder="薪资范围"></el-input>
                    </el-form-item>
                </el-col>
            </el-form-item>

            <el-form-item label="年龄要求" required label-width="245px">
                <el-col :span="11">
                    <el-form-item prop="jobAgeStart">
                        <el-input v-model="dataForm.jobAgeStart" style="width: 100%;" placeholder="年龄要求"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="1">-</el-col>
                <el-col :span="11">
                    <el-form-item prop="jobAgeEnd">
                        <el-input v-model="dataForm.jobAgeEnd" style="width: 100%;" placeholder="年龄要求"></el-input>
                    </el-form-item>
                </el-col>
            </el-form-item>

            <el-form-item label="学历要求" prop="positionEducation">
                <el-col :span="18">
                    <el-select v-model="dataForm.positionEducation" placeholder="填写学历要求">
                        <el-option
                                v-for="item in educationOption"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                                @chang="positionEducationOptionChange">
                        </el-option>
                    </el-select>
                </el-col>
            </el-form-item>



            <el-form-item label="证书要求" prop="positionCertifiCate" label-width="70px">
                <el-col :span="24">
                    <el-select
                            style="width: 300px"
                            v-model="dataForm.positionCertifiCate"
                            clearable
                            multiple
                            @change="positionCertifiCateOptionChange"
                            placeholder="请选择">
                        <el-option
                                v-for="item in certifiCateOption"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                        </el-option>
                    </el-select>
                </el-col>
            </el-form-item>

            <el-form-item label="职位福利" prop="detailPosition" label-width="80px">
                <el-col :span="24">
                    <el-select
                            style="width: 300px"
                            v-model="dataForm.positionWalfare"
                            clearable
                            multiple
                            @change="positionOptionChange"
                            placeholder="请选择">
                        <el-option
                                v-for="item in walfareOption"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                        </el-option>
                    </el-select>
                </el-col>
            </el-form-item>


            <el-form-item label="职位描述" prop="jobDescript">
                <el-row :span="24">
                    <el-input
                            style="width: 500px"
                            type="textarea"
                            v-model="dataForm.jobDescript"
                            placeholder="职位描述"
                            :rows = "3"
                            :cols="50"
                            maxlength="100"
                            show-word-limit>
                    </el-input>
                </el-row>
            </el-form-item>

            <el-form-item style="margin-left: 130px;margin-top: 35px">
                <el-button style="width: 150px" type="primary" @click="dataFormSubmit()">确定创建</el-button>
                <el-button style="width: 150px" @click="visible = false">取消创建</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    import commonApi from "@/api/commonApi";
    import workjobApi from "@/api/workjobs/workjobApi";

    export default {
        name: "workjob-create-info.vue",
        data () {
            return {
                dataForm: {
                    positionEducation:[],
                    positionCertifiCate:[],
                    positionWalfare:[],
                    jobName: '',
                    jobDescript: '',
                    jobDeptement: '',
                    jobContact: '',
                    jobPhone: '',
                    jobFixPhone: '',
                    jobWechat: '',
                    jobEmail: '',
                    jobQq: '',
                    isUrgency: '',                     //是否是急聘
                    companyId: '',
                    tradeId: '',
                    classifyId: '',
                    jobTypeId: '',
                    provincesId: '',
                    citysId: '',
                    areasId: '',
                    jobSalaryStart: '',
                    jobSalaryEnd: '',
                    jobApproveStatus: '',
                    jobIssueStatus: '',
                    jobRecruitStatus: '',
                    jobIsPass: '',
                    jobAgeStart: '',
                    jobAgeEnd: '',
                    jobDetailAddress: '',
                },
                userId:'',                        //用户Id
                educationOption:[],               //学历列表
                certifiCateOption:[],             //证书列表
                walfareOption:[],                 //福利列表
                dataRule: {
                    jobName: [
                        { required: true, message: '职位名称不能为空', trigger: 'blur' }
                    ],
                    jobDescript: [
                        { required: true, message: '职位描述不能为空', trigger: 'blur' }
                    ],
                    jobDeptement: [
                        { required: true, message: '职位部门不能为空', trigger: 'blur' }
                    ],
                    jobContact: [
                        { required: true, message: '联系人不能为空', trigger: 'blur' }
                    ],
                    jobPhone: [
                        { required: true, message: '联系手机不能为空', trigger: 'blur' }
                    ],
                    jobFixPhone: [
                        { required: true, message: '联系固话不能为空', trigger: 'blur' }
                    ],
                    jobWechat: [
                        { required: true, message: '联系微信不能为空', trigger: 'blur' }
                    ],
                    jobEmail: [
                        { required: true, message: '联系邮箱不能为空', trigger: 'blur' }
                    ],
                    jobQq: [
                        { required: true, message: '联系qq不能为空', trigger: 'blur' }
                    ],
                    isUrgency: [
                        { required: true, message: '是否紧急招聘不能为空', trigger: 'blur' }
                    ],
                    companyId: [
                        { required: true, message: '企业ID不能为空', trigger: 'blur' }
                    ],
                    jobSalaryStart: [
                        { required: true, message: '请输入起始薪资', trigger: 'blur' }
                    ],
                    jobSalaryEnd: [
                        { required: true, message: '请输入结束薪资', trigger: 'blur' }
                    ],
                    jobAgeStart: [
                        { required: true, message: '请输入起始年龄', trigger: 'blur' }
                    ],
                    jobAgeEnd: [
                        { required: true, message: '请输入结束年龄', trigger: 'blur' }
                    ],
                    jobDetailAddress: [
                        { required: true, message: '详细地址不能为空', trigger: 'blur' }
                    ]
                },


                industryOptions:[],               //行业的选项卡
                industryOptionsArr:[],            //选中的值
                companyAddressOptions:[],         //地址的选项卡
                companyAddressOptionsArr:[],         //选中的值
            }
        },
        created () {
        },
        mounted () {
            this.loadingIndustory()
            this.loadingCompanyAddress()
            this.loadingCertifiCate()
            this.loadingPositionWalfare()
            this.loadingEducation()
        },
        methods: {
            //加载学历的信息
            loadingEducation(){
                commonApi.loadingEducation()
                .then(data => {
                    if (data && data.data.code=== 0){
                        this.educationOption = data.data.data
                    }
                })
                .catch(error => {
                    Promise.reject(error)
                })
            },
            //加载行业选项
            loadingIndustory(){
                commonApi.loadingIndustoryTwo()
                    .then(data => {
                        if (data && data.data.code=== 0){
                            this.industryOptions = data.data.data
                        }
                    })
                    .catch(error => {
                        Promise.reject(error)
                    })
            },
            //加载企业地址选项
            loadingCompanyAddress(){
                commonApi.loadingCompanyAddress()
                    .then(data =>{
                        if (data && data.data.code === 0){
                            this.companyAddressOptions = data.data.data
                        }
                    })
                    .catch(error =>{
                        Promise.reject(error)
                    })
            },
            //加载证书列表
            loadingCertifiCate(){
                commonApi.loadingCertifiCate()
                .then(data => {
                    console.log("data certifi ===>>",data)
                    if (data && data.data.code === 0){
                        this.certifiCateOption = data.data.data
                    }
                })
                .catch(error =>{
                    Promise.reject(error)
                })
            },
            //加载职位福利列表
            loadingPositionWalfare(){
                commonApi.loadingWelfare()
                    .then(data => {
                        console.log("data  walfare==>",data
                        )
                        if (data && data.data.code === 0){
                            this.walfareOption = data.data.data
                        }
                    })
                    .catch(error => {
                        Promise.reject(error)
                    })
            },

            dataFormSubmit(){



                /*提交表单时候数据的合法性校验*/
                if (this.dataForm.jobName === ''){
                    this.$message({
                        type:'warning',
                        message:'请填写职位名称'
                    })
                    return
                }

                if (this.dataForm.jobDeptement === ''){
                    this.$message({
                        type:'warning',
                        message:'请填写部门名称'
                    })
                    return
                }

                if (this.dataForm.jobContact === ''){
                    this.$message({
                        type:'warning',
                        message:'请填写联系人'
                    })
                    return
                }

                if (this.dataForm.jobPhone === ''){
                    this.$message({
                        type:'warning',
                        message:'请填写联系手机号'
                    })
                    return
                }
                //手机号验证
                var phoneRegex = "0?(13|14|15|17|18|19)[0-9]{9}"
                if (!this.dataForm.jobPhone.match(phoneRegex)){
                    this.$message({
                        type:'warning',
                        message:'手机号格式不正确呢'
                    })
                    return
                }

                if (this.dataForm.jobFixPhone === ''){
                    this.$message({
                        type:'warning',
                        message:'请填写联系固定电话'
                    })
                    return
                }

                if (this.dataForm.jobWechat === ''){
                    this.$message({
                        type:'warning',
                        message:'请填写联系微信'
                    })
                    return
                }

                if (this.dataForm.jobEmail === ''){
                    this.$message({
                        type:'warning',
                        message:'请填写联系邮箱'
                    })
                    return
                }

                //邮箱格式校验
                var emailRegex = "\\w[-\\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\\.)+[A-Za-z]{2,14}"
                if (!this.dataForm.jobEmail.match(emailRegex)){
                    this.$message({
                        type:'warning',
                        message:'邮箱格式不正确'
                    })
                    return
                }

                if (this.dataForm.jobQq === ''){
                    this.$message({
                        type:'warning',
                        message:'请填写联系QQ'
                    })
                    return
                }

                var qqRegex = '[1-9][0-9]{4,14}'
                if (!this.dataForm.jobQq.match(qqRegex)){
                    this.$message({
                        type:'warning',
                        message:'QQ号码格式不正确'
                    })
                    return
                }

                if (this.companyAddressOptionsArr.length === 0){
                    this.$message({
                        type:'warning',
                        message:'请选择工作地址'
                    })
                    return
                }

                if (this.industryOptionsArr.length === 0){
                    this.$message({
                        type:'warning',
                        message:'请选择行业信息'
                    })
                    return
                }

                if (this.dataForm.jobDetailAddress == ''){
                    this.$message({
                        type:'warning',
                        message:'请填写职位的详细地址'
                    })
                    return
                }

                if (this.dataForm.detailPosition === ''){
                    this.$message({
                        type:'warning',
                        message:'请输入详细地址信息'
                    })
                    return
                }

                if (this.dataForm.jobAgeStart == '' || this.dataForm.jobAgeEnd == ''){
                    this.$message({
                        type:'warning',
                        message:'请输入年龄范围'
                    })
                    return
                }

                if(this.dataForm.jobAgeStart < 18 || this.dataForm.jobAgeEnd > 65){
                    this.$message({
                        type:'warning',
                        message:'请输入合法年龄 18 ~ 65 之间'
                    })
                    return
                }


                if (this.dataForm.jobAgeStart > this.dataForm.jobAgeEnd){
                    this.$message({
                        type:'warning',
                        message:'不可以大于起始年龄段'
                    })
                    return
                }


                if(this.dataForm.jobSalaryStart == '' || this.dataForm.jobSalaryEnd == ''){
                    this.$message({
                        type:'warning',
                        message:'请输入薪资范围'
                    })
                    return
                }

                if (parseInt(this.dataForm.jobSalaryStart) < 0 || parseInt(this.dataForm.jobSalaryEnd)<0){
                    this.$message({
                        type:'warning',
                        message:'薪资范围不合法'
                    })
                    return
                }

                if (parseInt(this.dataForm.jobSalaryStart) > parseInt(this.dataForm.jobSalaryEnd)){
                    this.$message({
                        type:'warning',
                        message:'不可以小于起始薪资范围'
                    })
                    return
                }

                if (this.dataForm.positionEducation.length === 0){
                    this.$message({
                        type:'warning',
                        message:'请填写学历信息'
                    })
                    return
                }

                if (this.dataForm.positionCertifiCate.length === 0){
                    this.$message({
                        type:'warning',
                        message:'请填写证书信息'
                    })
                    return
                }

                if (this.dataForm.positionWalfare.length === 0){
                    this.$message({
                        type:'warning',
                        message:'请填写福利信息'
                    })
                    return
                }

                if (this.dataForm.jobDescript == ''){
                    this.$message({
                        type:'warning',
                        message:'请填写职位描述信息'
                    })
                    return
                }

                this.userId = JSON.parse(localStorage.getItem('user')).userId
                let obj = {
                    'id': this.dataForm.id || undefined,
                    'jobName': this.dataForm.jobName,
                    'jobDescript': this.dataForm.jobDescript,
                    'jobDeptement': this.dataForm.jobDeptement,
                    'jobContact': this.dataForm.jobContact,
                    'jobPhone': this.dataForm.jobPhone,
                    'jobFixPhone': this.dataForm.jobFixPhone,
                    'jobWechat': this.dataForm.jobWechat,
                    'jobEmail': this.dataForm.jobEmail,
                    'jobQq': this.dataForm.jobQq,
                    'isUrgency': this.dataForm.isUrgency,
                    'companyId': this.dataForm.companyId,
                    'tradeId': this.dataForm.tradeId,
                    'classifyId': this.dataForm.classifyId,
                    'jobTypeId': this.dataForm.jobTypeId,
                    'provincesId': this.dataForm.provincesId,
                    'citysId': this.dataForm.citysId,
                    'areasId': this.dataForm.areasId,
                    'jobSalaryStart': this.dataForm.jobSalaryStart,
                    'jobSalaryEnd': this.dataForm.jobSalaryEnd,
                    'jobApproveStatus': this.dataForm.jobApproveStatus,
                    'jobIssueStatus': this.dataForm.jobIssueStatus,
                    'jobRecruitStatus': this.dataForm.jobRecruitStatus,
                    'jobIsPass': this.dataForm.jobIsPass,
                    'jobAgeStart': this.dataForm.jobAgeStart,
                    'jobAgeEnd': this.dataForm.jobAgeEnd,
                    'jobDetailAddress': this.dataForm.jobDetailAddress,
                    'educationId':this.dataForm.positionEducation,
                    'createUserId':this.userId,
                    'positionCertifiCate':this.dataForm.positionCertifiCate,
                    'positionWalfare':this.dataForm.positionWalfare,
                }
                workjobApi.createWorkJob(obj)
                .then(data => {
                    if (data.data.code === 0){
                        this.$message({
                            type:'success',
                            message:'职位创建成功'
                        })
                    }else if (data.data.code === 500){
                        this.$message({
                            type:'warning',
                            message:data.data.msg
                        })
                    }
                })
                .catch(error => {
                    Promise.reject(error)
                })

            },
            //加载学历change事件
            positionEducationOptionChange(value){
                console.log("this.dataForm.positionEducation",value)
                this.dataForm.positionEducation = value
            },
            //职位福利change事件
            positionOptionChange(value){
                console.log("positionOpti ====>",value)
            },
            //职位证书要求 change事件
            positionCertifiCateOptionChange(value){
                console.log("position certifiCate ==>>",value)
            },
            handleChangeIndustory(value){
                console.log("行业的value ===》",value)
                this.dataForm.tradeId = value[0]
                this.dataForm.classifyId = value[1]
                this.dataForm.jobTypeId = value[2]
                console.log("行业1 ==>" ,this.dataForm.tradeId)
                console.log("行业2 ==>" ,this.dataForm.classifyId)
                console.log("行业3 ==>" ,this.dataForm.jobTypeId)
            },
            handleChangeAddress(value){
                console.log("地址的value ===》",value)
                this.dataForm.provincesId = value[0]
                this.dataForm.citysId = value[1]
                this.dataForm.areasId = value[2]
                console.log("地址1 ==》",this.dataForm.provincesId)
                console.log("地址2 ==》",this.dataForm.citysId)
                console.log("地址3 ==》",this.dataForm.areasId)
            }
        }
    }
</script>

<style scoped>

</style>
